<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<%
request.setCharacterEncoding( "UTF-8" );
response.setCharacterEncoding( "UTF-8" );
response.setContentType( "text/html; charset=UTF-8" );
%>

<link rel="stylesheet" href="${pageContext.request.contextPath }/resources/css/style.css" type="text/css"/>
	<script src="resources/js/jquery-1.9.1.js"></script>
	<script src="resources/js/etc/modifyGamesPreview.js"></script>
	<script type="text/javascript">
		window.onload = function() {
			$("select[name=genre]").val( $("#selectedValue").val() ).attr( "selected", "selected" );
			var checknum = 0;
			if ( $("#isGgong").val() == "true" ) {
				$("input[name=g_ggong]").attr( "checked", "checked" );
				$("input[name=offerggong]").attr( "disabled", false );
				checknum++;
			}
			if ( $("#isGgongdon").val() == "true" ) {
				$("input[name=g_ggongdon]").attr( "checked", "checked" );
				checknum++;
			}
			if ( $("#isTime").val() == "true" ) {
				$("input[name=g_time]").attr( "checked", "checked" );
				checknum++;
			}
			if ( $("#isSpecial").val() == "true" ) {
				$("input[name=g_special]").attr( "checked", "checked" );
				checknum++;
			}
			if ( checknum == 4 ) {
				$("#serviceAllChk").attr( "checked", "checked" );
			}
			$("input[name=mission]:input[value=" + $("#selectedMission").val() + "]").attr( "checked", "checked" );
		};
	</script>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>꽁알 Administrator</title>
</head>
<body>

<h2>게임 정보 변경</h2>
<br/>
<!-- 임시변수 -->
<input type="hidden" id="selectedValue" value="${resultClass.genre }"/>
<input type="hidden" id="isGgong" value="${resultClass.g_ggong }"/>
<input type="hidden" id="isGgongdon" value="${resultClass.g_ggongdon }"/>
<input type="hidden" id="isTime" value="${resultClass.g_time }"/>
<input type="hidden" id="isSpecial" value="${resultClass.g_special }"/>
<input type="hidden" id="selectedMission" value="${resultClass.mission }"/>
<!-- 임시변수 끝 -->

<form action="modifyGames.ga" method="post" autocomplete="off" enctype="multipart/form-data" onsubmit="return checkInput()">
	<table>
		<tr>
			<td width="120">■ 게임 명 </td>
			<td><input type="text" name="name" value="${resultClass.name }" size="40" maxlength="20"/></td>
		</tr>
		<tr>
			<td>■ ID </td>
			<td>
				<input type="text" value="${resultClass.no }" size="40" disabled/>
				<input type="hidden" name="no" value="${resultClass.no }"/>
			</td>
		</tr>
		<tr>
			<td>■ 게임 종류 </td>
			<td>
				<select name="genre" style="width:260px;">
					<option value="all">전체</option>
					<option value="puzzle">두뇌게임/퍼즐</option>
					<option value="racing">레이싱 게임</option>
					<option value="sports">스포츠 게임</option>
					<option value="arcade">아케이드 게임</option>
					<option value="card">카드배틀 게임</option>
					<option value="casual">캐주얼 게임</option>
				</select>
			</td>
		</tr>
		<tr>
			<td valign="top">■ 상세 설명 </td>
			<td><textarea rows="6" cols="80" name="info" style="resize:none;">${resultClass.info }</textarea></td>
		</tr>
	</table>
	
	<br/><br/>
	
	<table style="width:800px;">
		<tr>
			<td width="15%">■ 카테고리 적용</td>
			<td>
				<input type="checkbox" id="serviceAllChk" onclick="serviceAllCtr(this)"/> 전체 &nbsp;
				<input type="checkbox" id="serviceChk" name="g_ggong" onclick="checkServiceAll()" onchange="checkGgong()"/> 꽁게임 
				(점수의 <input type="text" name="offerggong" size="7" value="${resultClass.offerggong }" maxlength="10" disabled/> % 꽁) &nbsp;
				<input type="checkbox" id="serviceChk" name="g_ggongdon" onclick="checkServiceAll()"/> 꽁돈게임 &nbsp;
				<input type="checkbox" id="serviceChk" name="g_time" onclick="checkServiceAll()"/> 타임게임 &nbsp;
				<input type="checkbox" id="serviceChk" name="g_special" onclick="checkServiceAll()"/> 스페셜게임 &nbsp;
			</td>
		</tr>
	</table>
	
	<br/><br/>
	
	<table style="width:800px;">
		<tr>
			<td width="15%">■ 가능 미션</td>
			<td>
				<input type="radio" name="mission" value="score"/>점수 &nbsp;
				<input type="radio" name="mission" value="level"/>단계 &nbsp;
				<input type="radio" name="mission" value="timelimit"/>버티기 &nbsp;
				<input type="radio" name="mission" value="timeclear"/>초안에 끝내기
			</td>
		</tr>
		<tr>
			<td valign="top">■ 미션 가이드라인</td>
			<td>
				<textarea name="m_detail" rows="3" cols="80" style="resize:none;">${resultClass.m_detail }</textarea>
			</td>
		</tr>
	</table>
	 
	 <br/><br/>
	
	<!-- 이미지 -->
	■ 게임 이미지 - 변경할 이미지만 다시 선택하세요.<p/>
	<table style="width:440px;border:1px solid #bbbbbb;" cellspacing="0" cellpadding="5">
		<tr>
			<td width="24%" class="table_titleHeight">메인이미지</td>
			<td width="24%">240 * 240</td>
			<td width="52%">
				<input type="file" id="img0" name="gamefiles[0]" onchange="previewImg(this)" onclick="fileClear(this)"/>
			</td>
		</tr>
		<tr>
			<td class="table_titleHeight">상세이미지1</td>
			<td>240 * 240</td>
			<td>
				<input type="file" id="img1" name="gamefiles[1]" onchange="previewImg(this)" onclick="fileClear(this)"/>
			</td>
		</tr>
		<tr>
			<td class="table_titleHeight">상세이미지2</td>
			<td>240 * 240</td>
			<td>
				<input type="file" id="img2" name="gamefiles[2]" onchange="previewImg(this)" onclick="fileClear(this)"/>
			</td>
		</tr>
		<tr>
			<td class="table_titleHeight">상세이미지3</td>
			<td>240 * 240</td>
			<td>
				<input type="file" id="img3" name="gamefiles[3]" onchange="previewImg(this)" onclick="fileClear(this)"/>
			</td>
		</tr>
	</table>
	
	<!-- 미니 미리보기 -->
	<div style="width:440px;float:left;">
		<table style="width:440px;border:1px solid #bbbbbb;" cellspacing="0" cellpadding="5">
			<tr style="height:110px;">
				<td align="center" width="25%"><div id="img0_preview" style="width:90px;height:90px;display:table-cell;vertical-align:middle;" onmouseover="mousePreview(0)">미리보기</div></td>
				<td align="center" width="25%"><div id="img1_preview" style="width:90px;height:90px;display:table-cell;vertical-align:middle;" onmouseover="mousePreview(1)">미리보기</div></td>
				<td align="center" width="25%"><div id="img2_preview" style="width:90px;height:90px;display:table-cell;vertical-align:middle;" onmouseover="mousePreview(2)">미리보기</div></td>
				<td align="center" width="25%"><div id="img3_preview" style="width:90px;height:90px;display:table-cell;vertical-align:middle;" onmouseover="mousePreview(3)">미리보기</div></td>
			</tr>
			<tr style="height:30px;">
				<td align="center">메인이미지</td>
				<td align="center">상세이미지1</td>
				<td align="center">상세이미지2</td>
				<td align="center">상세이미지3</td>
			</tr>
			<tr style="height:30px;">
				<td align="center"><div id="img0_size">사이즈</div></td>
				<td align="center"><div id="img1_size">사이즈</div></td>
				<td align="center"><div id="img2_size">사이즈</div></td>
				<td align="center"><div id="img3_size">사이즈</div></td>
			</tr>
		</table>
	</div>
	
	<!-- 큰 미리보기 -->
	<div style="width:300px;height:328px;float:left;position:relative;top:-154px;left:40px;border:1px solid #bbbbbb;">
		<table width="100%">
			<tr style="height:328px;">
				<td align="center"><div id="big_preview" style="width:280px;height:308px;display:table-cell;vertical-align:middle;">미리보기</div></td>
			</tr>
		</table>
	</div>
	
	<div style="position:relative; top:-120px; left:600px;width:120px;"><input type="submit" value="등록 완료" style="width:120px;"/></div>
</form>

<div id="hiddenP" style="display:none;"></div>

</body>
</html>